import React, { Component } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';

import * as homeAction from '../../reduck/home';

@connect(mapStateToProps, buildActionDispatcher)
export default class HomeComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {};
    this.onClick = this.onClick.bind(this);
  }

  onClick() {
    const { homeAction } = this.props;
    homeAction.updateTitle('React Promotion Beta')
  }

  render() {
    
    return (
      <div>
        <h1>
          {this.props.title}
        </h1>
        <button onClick={this.onClick}>
          Update title
        </button>
      </div>
    );
  }

  static get propTypes() {
    return {
      title: PropTypes.string,
      homeAction: PropTypes.any,
    }
  }
}

function mapStateToProps({ home }) {
  return { title: home.title };
}

function buildActionDispatcher(dispatch) {
  return {
    homeAction: bindActionCreators(homeAction, dispatch),
  };
}
